<template>
	<view class="content">
		<view class="header">
			<view class="loginTime">上次登录时间：{{logintime}}</view>
			<view class="userinfo" @tap="editInfo">
				<image :src="userinfo.avatar" mode="aspectFill" class="avatar"></image>
				<view class="info">
					<view class="name">{{userinfo.nickname}}</view>
					<view class="tel">{{userinfo.mobile}}</view>
				</view>
				<uni-icons type="forward" size="20" color="#999" class="icon"></uni-icons>
			</view>
		</view>
		<view class="header">
			<view class="title">我的服务</view>
			<navigator url="./contract/contract" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-hetong"></view>
						<text class="name">我的合同</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator>
			<navigator url="./sell/order" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-dingdan"></view>
						<text class="name">出售订单</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator>
			<!-- <navigator url="./transportOrder/list" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-dingdan"></view>
						<text class="name">我的运输单</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator> -->
			<navigator url="./settlement/settlement" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-jiesuan-jiesuandanguanli"></view>
						<text class="name">我的结算单</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator>
			<navigator url="./invoice/invoice" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-fapiao"></view>
						<text class="name">发票管理</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator>
			<navigator url="./clearOrder/clearOrder" hover-class="none">
				<view class="linkbtn">
					<view class="btn">
						<view class="icon iconfont icon-jiesuan-jiesuandanguanli"></view>
						<text class="name">我的清算单</text>
					</view>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</navigator>
		</view>
		<view class="header">
			<view class="title">我的信息</view>
			<!-- <view class="linkbtn">
				<view class="btn">
					<view class="icon iconfont icon-dizhi"></view>
					<text class="name">地址管理</text>
				</view>
				<view class="btn">
					<navigator url="./address/addressList" class="name" hover-class="none">去添加</navigator>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</view> -->
			<view class="linkbtn">
				<view class="btn">
					<view class="icon iconfont icon-qiye"></view>
					<text class="name">我的企业</text>
				</view>
				<view class="btn">
					<navigator url="./company/company" class="name" hover-class="none" v-if="userinfo.is_supplier">查看
					</navigator>
					<navigator url="./company/company" class="name" hover-class="none" v-else>去认证</navigator>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</view>
			<view class="linkbtn">
				<view class="btn">
					<view class="icon iconfont icon-yinhangka"></view>
					<text class="name">我的银行账号</text>
				</view>
				<view class="btn">
					<navigator url="./company/bank" class="name" hover-class="none" v-if="userinfo.bank">查看
					</navigator>
					<navigator url="./company/bank" class="name" hover-class="none" v-else>去认证</navigator>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</view>
			<view class="linkbtn">
				<view class="btn">
					<view class="icon iconfont icon-tongzhi"></view>
					<text class="name">我的通知</text>
				</view>
				<view class="btn">
					<navigator url="./msg/list" class="name" hover-class="none">查看
					</navigator>
					<uni-icons type="forward" size="20" color="#999"></uni-icons>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		getUserInfo
	} from '../../network/main.js';
	import {
		onShow,
		onNavigationBarButtonTap
	} from '@dcloudio/uni-app';
	import {
		ref,
		reactive,
		onMounted
	} from 'vue';
	onNavigationBarButtonTap((e) => {
		uni.navigateTo({
			url: '/pages/setting/setting'
		})
	})
	onShow(() => {
		getInfo()
	})
	const userinfo = reactive({})
	const logintime = ref(uni.getStorageSync('logintime'))
	const getInfo = () => {
		getUserInfo({}).then(res => {
			if (res.data.data) {
				Object.assign(userinfo, res.data.data)
			}
		})
	}
	const editInfo = () => {
		uni.navigateTo({
			url: '/pages/mine/editInfo'
		})
	}
</script>

<style lang="scss" >
	.header {
		padding: 20rpx 30rpx;
		box-sizing: border-box;
		background-color: #fff;
		margin-bottom: 20rpx;
		color: #333;

		.loginTime {
			font-size: 24rpx;
			color: #666;
		}

		.userinfo {
			margin-top: 20rpx;
			border-top: 2rpx dashed #f6f6f6;
			padding-top: 20rpx;
			box-sizing: border-box;

			.avatar {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50rpx;
			}

			.info {
				display: inline-block;
				height: 100rpx;
				margin-left: 30rpx;

				.name {
					font-size: 36rpx;
				}

				.tel {
					font-size: 28rpx;
					margin-top: 16rpx;
				}
			}

			.icon {
				float: right;
				margin-top: 50rpx;
			}
		}

		.title {
			font-size: 28rpx;
			margin-bottom: 20rpx;
		}

		.linkbtn {
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.btn {
				display: flex;
				align-items: center;
				flex-direction: flex-start;
				gap: 20rpx;
				padding: 20rpx 0;

				.icon {
					color: #ffc400;
				}

				.name {
					font-size: 28rpx;
				}
			}
		}
	}
</style>